(function () {
  let data = {
    day365: { orders: '20,301,987', amount: '99834' },
    day90: { orders: '301,987', amount: '9834' },
    day30: { orders: '1,987', amount: '3834' },
    day1: { orders: '987', amount: '834' },
  }
  // 思路:
  // (1) 注册点击事件
  // (2) 添加高亮
  // (3) 切换数据
  // (4) 渲染页面
  $('.order a').on('click', function () {
    // 同步下标
    nowIndex = $(this).index()
    // 清除定时器
    clearInterval(t)
    $(this).addClass('active').siblings().removeClass('active')
    // 获取自定义属性
    let dataKey = $(this).attr('data-key')
    // 获取 值
    let dataObj = data[dataKey]
    // console.log(dataObj);
    $('.order h4').eq(0).html(dataObj.orders)
    $('.order h4').eq(1).html(dataObj.amount)

    // 将定时器恢复过来
    orderInterval()
  })

  // (5) 自动切换
  // (5.1) 定时器
  // (5.2) 
  // 1 2 3 4 切换 => 根据下标
  let nowIndex = 0 // 默认的下标
  let t  // 定时器变量默认值 (必须是全局变量)
  function orderInterval() {
    t = setInterval(() => {
      nowIndex++
      if (nowIndex === $('.order a').length) {
        nowIndex = 0
      }
      $('.order a').eq(nowIndex).trigger('click')
    }, 2000);
  }
  orderInterval()

  // 主动触发事件
  // JQ 
  // click()
  // trigger('事件类型')
  // triggerHandler('事件类型')
})()